<template>
    <div class="son">
        <div>money: {{ money }}</div>
        <div>doubleMoney: {{ doubleMoney }}</div>
        <button @click="$emit('getSonMsg', girlFirend)">给父组件通信</button>
    </div>
</template>

<script setup>
import { ref, computed } from 'vue'
let Props = defineProps(['money'])
const doubleMoney = computed(() => {
    return Props.money * 2
})
const girlFirend = ref('阿雅')
</script>

<style scoped>
.son {
    height: 200px;
    width: 200px;
    border: 2px solid black;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 10px;
}
</style>